<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>执行上下文</title>
</head>

<body>
    <!-- 
        1. 代码分类（按位置）
            全局代码
            函数（局部）代码
        2. 全局执行上下文
            在执行全局代码前，将window确定为全局执行上下文
            对全局数据进行预处理
                var定义的全局变量 ==>undefined，添加为window的属性
                Function声明的全局函数 ==> 赋值（fun），添加为widow的方法
                this ==> 赋值（window）
            开始执行全局代码
        3. 函数执行上下文
            在调用函数，准备执行函数体之前，创建对应的函数执行上下文对象
            对局部函数进行预处理
                形参变量 ==> 赋值（实参） ==> 添加为执行上下文的属性
                arguments ==> 赋值（实参列表），添加为执行上下文的属性
                var定义的局部变量 ==> undefined，添加为执行上下文的属性
                function声明的函数 ==> 赋值（fun），添加为执行上下文的方法
                this == > 赋值（调用函数的对象）
            开始执行函数体代码
     -->
    <script>
        //  全局执行上下文
        //  相当于console.log(window.a1)
        console.log(a1)
        var a1
        a2()
        function a2() {
            console.log('a2()')
        }


        console.log('-------分割线-------')
        //  函数执行上下文
        function Fn(a1) {
            console.log(a1);
            console.log(a2)
            a3()
            console.log()
            // arguments 是一个伪数组（包含了函数的参数）
            console.log(arguments)
            var a2 = 3
            function a3() {
                console.log('a3()')
            }
        }
        // 当真正执行这个函数时才会创建函数执行上下文
        Fn(2, 3)
    </script>
</body>

</html>